<template>
  <div id="daily">
    <van-row style="width: 90%; margin: 20px auto">
      <van-col
        style="
          width: 100%;
          height: 13vh;
          padding: 3%;
          background: #fad39a;
          border-radius: 10px;
        "
      >
        <div>
          <div style="text-align: center; line-height: 11vh" class="bot">
            昨日共导入客户量：<span>{{ totalCount }}</span> 位
          </div>
        </div>
      </van-col>
    </van-row>

    <van-row style="width: 90%; margin: 20px auto">
      <van-col
        style="
          width: 48%;
          float: left;
          padding: 5% 1%;
          background: #f8be96;
          border-radius: 10px;
        "
      >
        <div>
          <div style="text-align: center;">
            <van-icon name="star" color="red" /> <span>关注平台数量：</span>
          </div>
          <div style="text-align: center" class="bot">
            <span>{{ followCount }}</span> 位
          </div>
        </div>
      </van-col>

      <van-col
        style="
          width: 48%;
          float: right;
          padding: 5% 1%;
          background: #f8c26a;
          border-radius: 10px;
        "
      >
        <div>
          <div style="text-align: center;">
            <van-icon name="star-o" color="red" /> <span>未关注平台数量：</span>
          </div>
          <div style="text-align: center" class="bot">
            <span>{{ attentionCount }}</span> 位
          </div>
        </div>
      </van-col>
    </van-row>
  </div>
</template>
<script>
import { Row, Col } from 'vant';
import { imo } from '@/api/api';

export default {
  name: 'daily',
  data() {
    return {
      followCount: '',
      attentionCount: '',
      totalCount: '',
    };
  },
  created() {
    this.imot();
  },
  methods: {
    imot() {
      imo({}).then((res) => {
        console.log(res);
        this.followCount = res.data.data.followCount;
        this.attentionCount = res.data.data.attentionCount;
        this.totalCount = res.data.data.totalCount;
      });
    },
  },
  components: {
    [Row.name]: Row,
    [Col.name]: Col,
  },
};
</script>

<style lang="scss">
* {
  margin: 0;
  padding: 0;
}
div {
  font-weight: 600;
  font-size: 2.1vh;
}
.bot {
  span {
    // display: inline-block;
    padding: 1%;
    width: auto;
    border-bottom: 1px solid rgba(5, 5, 5, 0.767);
  }
}
</style>